<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8"/>
    <title>我的钱包</title>
    <meta name="keywords" content="">
    <meta name="description" content="">
    <meta name="renderer" content="webkit">
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <meta name="mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no,email=no,address=no"/>
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
    <link rel="stylesheet" href="../css/common.css"/>
    <link rel="stylesheet" href="../css/main.css"/>
    <style>
        header{
            height: 4rem;
            background: linear-gradient(to right, #ffd200 0%,#ef8200 100%);
        }
        .w160{width: 1.6rem;}
        .tab .active{
            background: #ef8200;
            color: #fff;
        }
    </style>
</head>
<body class="bw">
    <header class="flex_aj flex_column">
        <p class="colw font35" id="money"></p>
        <p class="colw mt10">余额（元）</p>
        <a href="./ad_recharge.html" class="bw color1 border-r6 lh60 w160 mt20 tap tac">充值</a>
    </header>
    <p class="lh70 col9 plr24 bgf5">明细</p>
    <section>
        <div class="plr70 ptb40">
            <div class="flex border1 border-r1 lh70 tac col9 tab">
                <div class="flex1 active tab_item" data-type="">全部</div>
                <div class="flex1 bdl tab_item" data-type="3">充值</div>
                <div class="flex1 bdl tab_item" data-type="4">消费</div>
            </div>
        </div>
        <div class="plr24" id="list">
            <!--<a class="ptb40 flex_sb bdb">-->
               <!--<div>-->
                   <!--<p class="font16">广告消费</p>-->
                   <!--<p class="mt10 font13">2017-12-22 20:23:36</p>-->
               <!--</div>-->
                <!--<span class="color2 font15">-￥50.00</span>-->
            <!--</a>-->
            <!--<a class="ptb40 flex_sb bdb">-->
                <!--<div>-->
                    <!--<p class="font16">充值</p>-->
                    <!--<p class="mt10 font13">2017-12-22 20:23:36</p>-->
                <!--</div>-->
                <!--<span class="color2 font15">+￥50.00</span>-->
            <!--</a>-->
        </div>
    </section>
</body>
</html>
<script src="../js/jquery-1.8.3.min.js"></script>
<script src="../js/dlc.js"></script>
<script>
    var type = '';
    get_money();get_list();
    function get_money(){
        dlc_request('/api/walletDetail/findWallet',{ 'id':get_save('userId')},function(res){
            console.log(res);
            if(res.code == 1){
                $('#money').text(res.data.wallet);
            }else{
                dlctipbox.show(res.msg);
            }
        });
    }
    function get_list(){
        var data = {'userId':get_save('userId'),'page':1,'limit':999};
        if(type)data.type = type;
        dlctipbox.loading();
        dlc_request('/api/walletDetail/wdList',data,function(res){
            console.log(res);
            if(res.code == 1){
                var res = res.data.list;
                var str='';
                for(var i in res){
                    str+='<a href="./ad_recharge_details.html?id='+res[i].id+'" class="ptb40 flex_sb bdb">'+
                            '<div>'+
                            '<p class="font16">'+(res[i].type==3?"充值":"广告消费")+'</p>'+
                            '<p class="mt10 font13">'+format(res[i].createTime,'Y-m-d H:i:s')+'</p>'+
                    '</div>'+
                    '<span class="color2 font15">'+(res[i].type==3?"+":"-")+'￥'+res[i].money+'</span>'+
                    '</a>';
                }
                if(str){
                    $('#list').html(str);
                }else{
                    $('#list').html(emptyTip('暂无数据'));
                }
            }else{
                dlctipbox.show(res.msg);
            }
            dlctipbox.clear();
        });
    }
    var isPageHide = false;
    window.addEventListener('pageshow', function () {
        if (isPageHide) {
            get_money();
        }
    });
    window.addEventListener('pagehide', function () {
        isPageHide = true;
    });
    $('.tab').on('click','.tab_item',function(){
        $(this).addClass('active').siblings().removeClass('active');
        type = $(this).data('type');
        get_list();
    });
</script>






















